<template>
	<view>
		<view class="top">
			
		</view>
		
		<view class="bottom">
			<view class="body">
				<view class="baseinfo">
					<view class="item">
						<view class="item-name">
							标题：
						</view>
						
						<view class="content">
							汽车优惠活动开始领取了
						</view>
					</view>
					
					
					<view class="item">
						<view class="item-name">
							发布人：
						</view>
						
						<view class="content">
							大美汽修
						</view>
					</view>
	
	
					<view class="item">
						<view class="item-name">
							发布时间：
						</view>
						
						<view class="content">
							2023/03/10 11:09
						</view>
					</view>
					
					<view class="item">
						<view class="item-name">
							审核状态：
						</view>
						
						<view class="content">
							待审核/审核通过/审核不通过
						</view>
					</view>
					
					<view class="item">
						<view class="item-name">
							审核时间：
						</view>
						
						<view class="content">
							大美汽修
						</view>
					</view>
					
					
					<view class="item">
						<view class="item-name">
							审核说明：
						</view>
						
						<view class="content">
							大美汽修
						</view>
					</view>
					
				</view>
				<view class="extrainfo">
					
					<view class="item">
						<view class="item-name">
							发布内容：
						</view>
						
						<view class="content">
							活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容
							活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容
							活动内容活动内容活动内容活动内容活动内容活动内容
						</view>
					</view>
					
					<view class="item">
						<view class="item-name">
							图片：
						</view>
						
						<view class="content">
							
						</view>
					</view>
					
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style scoped>
	
	.top{
		height: 25vh;
		background-color: #1f73f1;
	}
	.bottom{
		padding: 20rpx;
		min-height: 75vh;
		background-color: #f8f8f8;
	}
	.item{
		display: flex;
		margin-bottom: 30rpx;
		align-items: flex-start;
	}
	.content{
		flex: 1;
		margin-left: 20rpx;
		word-wrap: break-word;
		line-height: 1.5;
	}
	.body{
		padding: 20rpx;
	}
	.item-name{
		font-size: 32rpx;
		color: #333333;
		min-width: 160rpx;
		flex-shrink: 0;
	}
	.baseinfo{
		background-color: #ffffff;
		padding: 30rpx;
		border-radius: 25rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
	}
	.extrainfo{
		margin-top: 30rpx;
		background-color: #ffffff;
		padding: 30rpx;
		border-radius: 25rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
	}
	
	/* 发布内容区域特殊处理 */
	.extrainfo .item {
		align-items: flex-start;
	}
	
	.extrainfo .item-name {
		margin-top: 4rpx;
	}
	
	.extrainfo .content {
		font-size: 30rpx;
		color: #666666;
		line-height: 1.6;
	}
	.body{
		transform: translateY(-350rpx);
	}
</style>
